<template>
  <div>
    <!-- <el-input
      :modelValue="userName"
      @update:modelValue="handleInput"
    ></el-input>
    <el-button @click="handleClick">测试提交</el-button> -->
  </div>
</template>

<!-- <script setup>
import { ref, defineProps, defineEmits } from "vue";

// app.vue传数据过来 用props接收
let props = defineProps({
  modelValue: {
    type: String,
  },
});
// 定义事件派发
// 父组件中v-model 是自带update:modelValue
const emits = defineEmits(["update:modelValue", "gobaba"]);

// 接收父组件传递过来的数据，给userName定义一个初始化数据
let userName = ref(props.modelValue);
const handleInput = (value) => {
  // val回调参数：获取input的value值
  console.log(value);
  userName.value = value;
  // 获取到了新的value后，需要派发回父组件
  emits("update:modelValue", value);
};
// 定义按钮
const handleClick = () => {
  // 获取对应的value值之后返回给爸爸，做数据请求
  emits("gobaba", userName);
};
</script> -->

<style lang="scss" scoped></style>
